<template>
  <div class="view-container">
    <el-form :model="zongHe" ref="ruleForm" label-width="80px" label-position="left">

      <div class="zh-form-container">

        <el-form-item label="用印人" prop="name">
          <el-input readonly :value="username"></el-input>
        </el-form-item>

        <el-form-item label="用印名称" prop="mingCheng">
          <el-input v-model="zongHe.mingCheng"></el-input>
        </el-form-item>


        <el-form-item label="表头名称" prop="docTitle">
          <el-select v-model="zongHe.docTitle" placeholder="请选择活动区域">
            <el-option label="请选择" value=""></el-option>
            <el-option v-for="item in docTitleList" :key="item.value" :value="item.value"
                       :label="item.label"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="申请类型">
          <span>外出携带印章审批</span>
        </el-form-item>

        <el-form-item label="计划使用时间起" prop="startTime">
          <el-date-picker
            v-model="zongHe.startTime"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="计划使用时间止" prop="endTime">
          <el-date-picker
            v-model="zongHe.endTime"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </el-form-item>

        <el-form-item label="前往单位" prop="faWangDanWei">
          <el-input v-model="zongHe.faWangDanWei"></el-input>
        </el-form-item>

        <el-form-item label="外出携带印章事由" prop="shiYou">
          <el-input type="textarea" v-model="zongHe.shiYou"></el-input>
        </el-form-item>

        <el-form-item label="备注" prop="beizhu">
          <el-input v-model="zongHe.beizhu"></el-input>
        </el-form-item>

        <el-form-item label="相关附件">
          <el-upload
            class="upload-demo"
            action="http://192.168.0.102:8002/api/fileUpload/upload?fileType=BaoXiaoFile"
            multiple
            :limit="10"
            :before-upload="beforeUpload"
            :on-success="uploadSuccess"
            :on-remove="handleRemove"
            :file-list="uploadFileList">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">文件大小请勿超过2MB</div>
          </el-upload>
        </el-form-item>

        <el-form-item label="审批人" style="margin-bottom: 0;" prop="auditorIdList">
          <el-select placeholder="添加审批人" v-model="zongHe.auditorIdList" multiple>
            <template slot="prefix">
              <svg-icon icon-class="add-person" class-name="icon"></svg-icon>
            </template>
            <el-option v-for="item in userList" :key="item.value" :value="item.value"
                       :label="item.label"></el-option>
          </el-select>
        </el-form-item>
        <p class="tip">审批顺序依照人员选择顺序</p>

      </div>
      <!--
            <el-form-item label="部门" prop="name">
              <el-input></el-input>
            </el-form-item>-->


      <!--<el-form-item label="表头名称" prop="region">
        <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>


      <el-form-item label="计划使用时间起" required>
        <div class="block">

          <el-date-picker
            v-model="value1"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </div>
      </el-form-item>

      <el-form-item label="计划使用时间止" required>
        <div class="block">

          <el-date-picker
            v-model="value1"
            type="datetime"
            placeholder="选择日期时间">
          </el-date-picker>
        </div>
      </el-form-item>


      <el-form-item label="前往单位" prop="name">
        <el-input></el-input>
      </el-form-item>


      <el-form-item label="材料名称" prop="desc">
        <el-input class="textareas" type="textarea" v-model="ruleForm.desc"></el-input>
      </el-form-item>-->


<!--      <el-form-item label="相关附件" prop="desc">
        <el-input></el-input>
      </el-form-item>

      <el-form-item label="备注" prop="desc">
        <el-input></el-input>
      </el-form-item>


      <el-form-item prop="region">
        <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>


      <el-form-item label="审批人" prop="region">
        <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
          <el-option label="区域一" value="shanghai"></el-option>
          <el-option label="区域二" value="beijing"></el-option>
        </el-select>
      </el-form-item>-->


      <!--      <el-form-item>
              <el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>

            </el-form-item>-->
    </el-form>
  </div>
</template>

<script>
  import zongHeMixin from '@/mixin/zongHeMixin'
  import zongHeAPI from '@/api/zongHe'
  import userAPI from '@/api/system/user'
  import { mapGetters } from 'vuex'

  export default {
    name: 'waichu_zonghe',
    mixins: [zongHeMixin],
    data() {
      return {
        ruleForm: [],
        mixinParams:{
          UserAPI:userAPI
        }
      }
    },
    computed: {
      ...mapGetters([
        'userId',
        'username'
      ])
    },
    created() {

    },
    methods: {}
  }
</script>

<style scoped lang="scss">
/*  .view-container {
    .el-input {
      width: 500px;
    }

    .textareas {
      width: 600px;

    }

    .el-form-item {
      margin-bottom: 15px;
    }

  }*/
</style>
